<div ng-controller="securityBaseController">
    <div class="security ng-scope" id="section-editor" ng-controller="securityActionGroupsController">

        <securityc-list-header></securityc-list-header>

        <div class="container">
            <div class="row">
                <div class="col-xs-12">
                    <div style="margin-bottom: 10px;">
                        <div style="display: inline;">
                            <span class="kuiInfoButton help" tooltip="Action Groups are named groups of permissions. You can assign Action Groups to Roles to configure their access permissions to indices and document types.">
                                <svg class="euiIcon euiIcon--large" focusable="false" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><path id="help-a" d="M13.6 12.186l-1.357-1.358c-.025-.025-.058-.034-.084-.056.53-.794.84-1.746.84-2.773a4.977 4.977 0 0 0-.84-2.772c.026-.02.059-.03.084-.056L13.6 3.813a6.96 6.96 0 0 1 0 8.373zM8 15A6.956 6.956 0 0 1 3.814 13.6l1.358-1.358c.025-.025.034-.057.055-.084C6.02 12.688 6.974 13 8 13a4.978 4.978 0 0 0 2.773-.84c.02.026.03.058.056.083l1.357 1.358A6.956 6.956 0 0 1 8 15zm-5.601-2.813a6.963 6.963 0 0 1 0-8.373l1.359 1.358c.024.025.057.035.084.056A4.97 4.97 0 0 0 3 8c0 1.027.31 1.98.842 2.773-.027.022-.06.031-.084.056l-1.36 1.358zm5.6-.187A4 4 0 1 1 8 4a4 4 0 0 1 0 8zM8 1c1.573 0 3.019.525 4.187 1.4l-1.357 1.358c-.025.025-.035.057-.056.084A4.979 4.979 0 0 0 8 3a4.979 4.979 0 0 0-2.773.842c-.021-.027-.03-.059-.055-.084L3.814 2.4A6.957 6.957 0 0 1 8 1zm0-1a8.001 8.001 0 1 0 .003 16.002A8.001 8.001 0 0 0 8 0z"></path></defs><use xlink:href="#help-a" fill-rule="evenodd"></use></svg>
                            </span>
                        </div>
                        <h3 class="indexheading euiTitle euiTitle--medium" style="display: inline;">Action Groups</h3>
                    </div>

                    <div class="kuiControlledTable">

                        <securityc-filter-bar></securityc-filter-bar>

                        <!-- Table -->
                        <table class="kuiTable" ng-show="(resourcenames | filter:query).length">
                            <thead>
                                <tr>

                                    <th class="kuiTableHeaderCell" ng-click="onSortChange('resourcename')">
                                        <span class="kuiTableHeaderCell__liner">
                                            Action Group Name
                                        </span>
                                        <span ng-show="sortTable.byKey === 'resourcename'"
                                              class="kuiIcon"
                                              ng-class="{'fa-long-arrow-down': sortTable.descending, 'fa-long-arrow-up': ! sortTable.descending}">
                                        </span>
                                    </th>

                                    <th class="kuiTableHeaderCell">
                                        <span class="kuiTableHeaderCell__liner">
                                            Permissions
                                        </span>
                                    </th>

                                    <th class="kuiTableHeaderCell">
                                        <span class="kuiTableHeaderCell__liner">
                                            Action Groups
                                        </span>
                                    </th>

                                    <th class="kuiTableHeaderCell kuiTableHeaderCell">
                                    </th>

                                </tr>
                            </thead>

                            <tbody>
                                <tr ng-repeat="actiongroupname in resourcenames | filter:query | orderBy:'toString()':sortTable.descending" class="kuiTableRow">

                                    <td class="kuiTableRowCell cellAlignTop">
                                        <div class="kuiTableRowCell__liner">
                                            <a class="kuiLink" ng-click="edit(actiongroupname)" title="{{actiongroupname}}">
                                                {{actiongroupname}}
                                            </a>
                                            <div ng-if="resources[actiongroupname].reserved">
                                                <span class="euiBadge euiBadge--default">
                                                  <span class="euiBadge__content">
                                                        <span class="euiIcon euiIcon--small euiBadge__icon kuiIcon fa-lock"></span>
                                                    <span class="euiBadge__text">reserved</span>
                                                  </span>
                                                </span>
                                            </div>
                                        </div>
                                    </td>

                                    <td class="kuiTableRowCell cellAlignTop">
                                        <div class="kuiTableRowCell__liner">
                                            <span title="{{permission}}" ng-repeat="permission in resources[actiongroupname].permissions">{{permission}}<br/></span>
                                        </div>
                                    </td>

                                    <td class="kuiTableRowCell cellAlignTop">
                                        <div class="kuiTableRowCell__liner">
                                            <span title="{{actiongroup}}" ng-repeat="actiongroup in resources[actiongroupname].actiongroups">{{actiongroup}}<br/></span>
                                        </div>
                                    </td>

                                    <td class="kuiTableRowCell actions cellAlignTop">
                                        <div class="kuiTableRowCell__liner">
                                            <a tooltip="Edit" ng-click="edit(actiongroupname)" class="kuiButton kuiButton--primary kuiButton--iconText">
                                                <span class="kuiButton__icon kuiIcon fa-edit"></span>
                                            </a>
                                            <a tooltip="Clone" ng-click="clone(actiongroupname)" class="kuiButton kuiButton--primary kuiButton--iconText">
                                                <span class="kuiButton__icon kuiIcon fa-copy"></span>
                                            </a>
                                            <button tooltip="Delete" type="button" ng-disabled="!endpointAndMethodEnabled('ACTIONGROUPS', 'DELETE') || resources[actiongroupname].reserved" ng-click="confirmDelete(actiongroupname)" class="kuiButton kuiButton--danger kuiButton--iconText">
                                                <span class="kuiButton__icon kuiIcon fa-trash-o"></span>
                                            </button>
                                        </div>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>

        <securityc-confirmation-modal ng-if="displayModal === true"
            header="Confirm Delete"
            body="Do you really want to delete '{{deleteModalResourceName}}'"
            on-close="closeDeleteModal"
            on-confirm="delete">
        </securityc-confirmation-modal>

    </div>
</div>
